<template>
    <div v-loading="surveyList == null" class="survey_list" style="min-height:80px;width:100%">
        <div class="survey_item" v-for="survey in surveyList" :key="survey.surveyId">
            <survey-item-component :surveyItem="survey" />
            <el-divider border-style="dotted" />
        </div>
    </div>
</template>
<script>
import SurveyItemComponent from './SurveyItemComponent.vue'
export default {
    components:{SurveyItemComponent},
    data() {
        return {
            surveyList: undefined,
            page: 1,
            pageSize: 10,
        }
    },
    created() {
        this.getSurveyList()
    },
    methods: {
        getSurveyList() {
            this.$store.state.ajaxQueue.length++
            this.$request.get('/browse/list-survey?collegeId=' + this.$store.state.area.collegeId).then(resp => {
                this.$store.state.ajaxQueue.finished++
                this.surveyList = resp.data
            })
        }
    }, watch: {
        '$store.state.area.collegeId'() {
            this.getSurveyList()
        },
    }
}
</script>
<style scoped>
.survey_list {
    display: flex;
    flex-wrap: wrap;
}
.survey_item {
    padding: 10px;
    width: 50%;
}
</style>